<template>
  <section class="jumbotron">
    <h3 class="jumbotron-heading">Search Github users</h3>
    <div>
      <input type="text" placeholder="enter the name you search" v-model="keyword" />&nbsp;
      <button @click="searchUsers">Search</button>
    </div>
  </section>
</template>

<script>
import axios from 'axios'
export default {
  name: "Search",
  data() {
    return {
      keyword: ""
    }
  },
  methods: {
    searchUsers() {
      this.$bus.$emit("updateListData", false, true, '', [])
      axios.get(`https://api.github.com/search/users?q=${this.keyword}`)
        .then(
          res => {
            console.log("请求成功：")
            // console.log("请求成功：", res.data.items)
            // 通过全局事件总线触发 getUsers 事件，传递res.data.items数据给getUsers函数
            // this.$bus.$emit("getUsers", res.data.items)
            this.$bus.$emit("updateListData", false, false, '', res.data.items)
          },
          error => {
            console.log(error)
          }
        )
    }
  }
};
</script>


<style></style>